<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>学生成绩查询</title>
    <link rel="stylesheet" href="../css/search_score.css"></link>
</head>
<body>
    <div class="container">
        <h2 style="text-align: center; color: green;">学生成绩查询</h2>
        
        <div class="search-box">
            <label for="sid">学号：</label>
            <input type="text" id="sid" placeholder="请输入学号">
            <button>查找</button>
        </div>

        <div style="display: flex;">
            <!-- 成绩表格 -->
            <div style="flex: 3;">
                <table id="score-table">
                    <thead>
                        <tr>
                            <th>课程号</th>
                            <th>课程名</th>
                            <th>成绩</th>
                        </tr>
                    </thead>
                    <tbody>
                        <!-- 数据将通过 JavaScript 动态填充 -->
                    </tbody>
                </table>
            </div>

            <!-- 学生信息 -->
            <div class="student-info">
                <p><strong>姓名：</strong><span id="name">王林</span></p>
                <p><strong>总学分：</strong><span id="credits">50</span></p>
                <p><strong>照片：</strong></p>
                <img src="../images/默认头像.png" alt="学生照片">
                <button class="exit-btn" onclick="window.close()">退出</button>
            </div>
        </div>
    </div>

    <script src="../js/search_score.js" type="module"></script>
</body>
</html>